<div class="dialog" style="width: {{#compare dialog.width '==' 'max-content'}}max-content{{else}}{{dialog.width}}px{{/compare}};{{#if dialog.height}}height: {{dialog.height}}px;{{/if}}{{#if dialog.maxHeight}}max-height: {{dialog.maxHeight}}px;{{/if}}">
	<div class="dialog-content" style="{{#if dialog.overflowHidden}}overflow: hidden; scrollbar-gutter: auto;{{/if}}{{#if dialog.maxHeight}}height: {{dialog.maxHeight}}px;{{/if}}">
		{{#if dialog.header}}
		<div class="dialog-header headline-small">{{{dialog.header}}}</div>
		{{/if}}
		{{#if dialog.scroll}}<div class="dialog-scroll-header"></div>{{/if}}
		{{#if dialog.content}}
		<div class="dialog-text body-medium{{#unless dialog.header}} dialog-not-header{{/unless}}{{#if dialog.scroll}} dialog-scroll{{#if dialog.buttons}} dialog-scroll-buttons{{/if}}{{/if}}">{{{dialog.content}}}</div>
		{{/if}}
		{{#if dialog.buttons}}
		{{#if dialog.scroll}}<div class="dialog-scroll-bottom"></div>{{/if}}
		<div class="dialog-buttons">
			{{#each dialog.buttons}}
			<div class="simple-button transparent gamepad-item"{{#if ../dialog.buttonsInNewLine}} style="float: right;"{{/if}} onclick="{{function}}">
				<div class="touch-effect">{{text}}</div>
			</div>
			{{#if ../dialog.buttonsInNewLine}}{{#unless @last}}<br>{{/unless}}{{/if}}
			{{/each}}
		</div>
		{{/if}}
		<cb></cb>
	</div>
</div>
<div class="dialog-clip-path-shadow elevation-2"></div>
<div class="dialog-close" onclick="events.closeDialog(); {{dialog.onClose}}"></div>